<div>
  <div class="cursor-pointer flex items-center nested-menu">
    {{ if .Pre }}
      <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
        {{ partial "icon.html" .Pre }}
      </span>
    {{ end }}
    <a
      {{ if .URL }}
        href="{{ .URL }}"
        {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
          target="_blank"
        {{ end }}
      {{ end }}
      class="text-base font-medium text-gray-500 hover:text-primary-600 dark:hover:text-primary-400"
      title="{{ .Title }}">
      <p>
        {{ .Name | markdownify }}
      </p>
    </a>
    <span>
      {{ partial "icon.html" "chevron-down" }}
    </span>
  </div>
  <div class="absolute menuhide">
    <div class="pt-2 p-5 mt-2 rounded-xl backdrop-blur shadow-2xl">
      <div class="flex flex-col space-y-3">
        {{ range .Children }}
          <a
            href="{{ .URL }}"
            {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
              target="_blank"
            {{ end }}
            class="flex items-center text-gray-500 hover:text-primary-600 dark:hover:text-primary-400">
            {{ if .Pre }}
              <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
                {{ partial "icon.html" .Pre }}
              </span>
            {{ end }}
            <p class="text-sm font-sm" title="{{ .Title }}">
              {{ .Name | markdownify }}
            </p>
          </a>
        {{ end }}
      </div>
    </div>
  </div>
</div>
